<template>
  <el-popover width="350" trigger="click">
    <slot name="content" class="flex flex-cloumn selected-port">
      <div class="flex justify-between mb-5">
        <span>{{ $t('EID_PORT_NUMBER') }}：{{ eidData.portInfo ? eidData.portInfo.bizName : '' }}</span>
        <span>{{ $t('SERVICE_BOARD_NUMBER') }}：{{ eidData.eidPort ? eidData.eidPort.biz : '' }}</span>
        <span>{{ $t('HUB_NUMBER') }}：{{ eidData.eidPort ? eidData.eidPort.hub : '' }}</span>
      </div>
      <div class="mb-5">{{ $t('ELECTRONIC_LABEL_INFORMATION') }}：{{ eidData.eidPort ? eidData.eidPort.eid : '' }}</div>
      <div>{{ $t('ELECTRONIC_TAG_RECORD') }}：{{ eidData.eidPort ? eidData.eidPort.preEid : '' }}</div>
    </slot>
    <i slot="reference" class="pointer" :class="eidData.ediIcon" />
  </el-popover>
</template>
<script>
  export default {
    props: {
      eidData: {
        type: Object,
        default: () => {
          return {
            portInfo: {},
            ediIcon: []
          }
        }
      }
    },
    data() {
      return {}
    }
  }
</script>
